<template>
  <view class="page_root" data-page-name="任务列表" data-page-identification="i_f546ooxwfw">
    <!-- UNI_APP_EXEGESIS_START NAVIGATION_TEMPLATE UNI_APP_EXEGESIS_END -->
    <!-- begin vid_z2zwbzlow4 自定义模板_923j1t5i2v -->
    <view class="container">
      <u-row class="search-params">
        <u-col :span="6">
          <u-popup-box
            componentName="u-cascader-asymmetric"
            mode="tree"
            v-model:modelValue="state.searchParams.projectId"
            placeholder="项目名称"
            :border="false"
            :options="state.projectList"
            :fieldNames="state.fieldNames"
          >
          </u-popup-box>
        </u-col>
        <u-col :span="3">
          <u-input :modelValue="state.taskStatusName" type="select" @click="state.statusVisible = true" />
          <u-select
            v-model:modelValue="state.statusVisible"
            @confirm="handleConfirm"
            :pickValue="[state.searchParams.taskStatus]"
            mode="single-column"
            :list="state.taskStatusList"
            :clearable="false"
          ></u-select>
        </u-col>
        <u-col :span="3">
          <!-- <u-popup-box v-model:modelValue="state.searchParams.endTime" :params="{ year: true, month: true, day: true }" :border="false" mode="time" componentName="u-picker"> </u-popup-box> -->
        </u-col>
      </u-row>

      <view class="content">
        <view v-if="state.taskList.length" v-for="item in state.taskList" :key="item.taskId" class="item" @click="handleJumpDetail(item.taskId,item)">
          <view class="inner">
            <view class="title">
              <span v-if="item.actionTaskId"  class="mark">行动项任务</span>
              <span v-if="item.actionTaskId">{{ item.actionTaskName }}</span>
              <span v-else>{{ item.taskName }}</span>

            </view>
            <view class="article">
              <view class="class1">
                <view style="display: flex;">
                  <view class="class2 mr10">{{ item.taskStatus }}</view>
                  <view class="first mr10" v-if="item.mark==='初验' ">初验</view>
                  <view class="lcb mr10" v-if="item.mark==='里程碑' ">里程碑</view>
                  <view class="finally mr10" v-if="item.mark==='终验' ">终验</view>
                  <view class="gjlj mr10" v-if="item.critialPath==='关键路径' ">关键路径</view>
                  <view class="class2" v-if="item.instanceId" style="color: #FEA631;">审批中</view>
                </view>
                <view class="class3">
                  <svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                    <title></title>
                    <g id="任务列表" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                      <g id="任务详情-可编辑备份-6" transform="translate(-296, -146)" fill-rule="nonzero">
                        <g id="编组-14备份-2" transform="translate(31, 143)">
                          <g id="编组-13" transform="translate(258, 0)">
                            <g id="编组-9备份-5" transform="translate(7, 1)">
                              <g id="编组-6" transform="translate(0, 2)">
                                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="14" height="14"></rect>
                                <path
                                  d="M9.40794574,10.9544574 L10.0862403,10.9544574 L10.0862403,10.2083333 L9.47577519,9.59786822 L7.91569767,9.59786822 L8.72965116,8.24127906 L10.0184109,8.24127906 L11.375,9.59786822 L11.375,12.3110465 L7.98352714,12.3110465 L9.40794574,10.9544574 L9.40794574,10.9544574 Z M4.65988372,10.9544574 L6.01647286,12.3110465 L2.625,12.3110465 L2.625,9.59786822 L2.69282946,9.59786822 L4.0494186,8.24127906 L5.3381783,8.24127906 L6.15213179,9.59786822 L4.59205426,9.59786822 L3.98158914,10.2083333 L3.98158914,10.9544574 L4.65988372,10.9544574 L4.65988372,10.9544574 Z M10.0862403,4.51065892 C10.0862403,6.20639536 8.72965116,7.5629845 7.03391472,7.5629845 C5.33817828,7.5629845 3.98158914,6.20639534 3.98158914,4.51065892 C3.98158914,2.8149225 5.3381783,1.45833334 7.03391472,1.45833334 C8.72965115,1.45833334 10.0862403,2.81492248 10.0862403,4.51065892 L10.0862403,4.51065892 Z M8.72965116,4.51065892 C8.72965116,3.56104651 7.98352714,2.81492248 7.03391472,2.81492248 C6.08430231,2.81492248 5.3381783,3.56104651 5.3381783,4.51065892 C5.3381783,5.46027133 6.08430233,6.20639534 7.03391472,6.20639534 C7.98352712,6.20639534 8.72965116,5.46027132 8.72965116,4.51065892 L8.72965116,4.51065892 Z M6.01647286,8.24127906 L8.05135658,8.24127906 L7.37306202,9.59786822 L8.05135658,11.6327519 L7.03391472,12.6501938 L6.01647286,11.6327519 L6.69476744,9.59786822 L6.01647286,8.24127906 L6.01647286,8.24127906 Z"
                                  id="形状"
                                  fill="#8C8C8C"
                                ></path>
                              </g>
                            </g>
                          </g>
                        </g>
                      </g>
                    </g>
                  </svg>
                  {{ item.taskOwner }}
                </view>
              </view>
              <!-- 新增关键路径目标 -->
              <u-row class="row" align="top">
                <u-col :span="4" class="title1 new-title">目标：</u-col>
                <u-col :span="8" class="value1" style="margin-left: -32rpx;">    <view class="new-text" v-for="(item, index) in handlerGetSpace1(item.milepostTarget)">
                                  {{ item?.trim() }}
                </view></u-col>
              </u-row>
              <u-row class="row" align="top">
                <u-col :span="4" class="title1 new-title">关键路径：</u-col>
                <u-col :span="8" class="value1" style="margin-left: -32rpx;"><view class="new-text" v-for="(item, index) in handlerGetSpace1(item.milepostCriticalPath)">
                                  {{ item?.trim() }}
                </view></u-col>
              </u-row>
              <!-- 新增关键路径目标 -->
              <u-row class="row">
                <u-col :span="4" class="title1">项目名称:</u-col>
                <u-col :span="8" class="value1" style="margin-left: -32rpx;">{{ item.projectName }}</u-col>
              </u-row>
              <u-row class="row" v-if="!item.actionTaskId">
                <u-col :span="4" class="title1">项目阶段:</u-col>
                <u-col :span="8" class="value1" style="margin-left: -32rpx;">{{ item.milepostName }}</u-col>
              </u-row>
              <u-row class="row no-padding">
                <u-col :span="6">
                  <u-row class="no-padding">
                    <u-col :span="5" class="title1">计划开始:</u-col>
                    <u-col :span="7" style="padding: 0;" class="value1">{{ item.startTime }}</u-col>
                  </u-row>
                </u-col>
                <u-col :span="6">
                  <u-row class="no-padding">
                    <u-col :span="5" class="title1">实际开始:</u-col>
                    <u-col :span="7" style="padding: 0;" class="value1">{{ item.actualStartTime }}</u-col>
                  </u-row>
                </u-col>
              </u-row>
              <u-row class="row no-padding">
                <u-col :span="6">
                  <u-row>
                    <u-col :span="5" class="title1">计划完成:</u-col>
                    <u-col :span="7" style="padding: 0;" class="value1">{{ item.endTime }}</u-col>
                  </u-row>
                </u-col>
                <u-col :span="6">
                  <u-row>
                    <u-col :span="5" class="title1">实际完成:</u-col>
                    <u-col :span="7" style="padding: 0;" class="value1">{{ item.taskFinishTime }}</u-col>
                  </u-row>
                </u-col>
              </u-row>
              <view class="label-wrapper">
                <template v-for="(label, index) in item.labelList" :key="index">
                  <view class="label" v-if="hasTime(label)" :class="activeClass(label)">
                    {{ label }}
                  </view>
                </template>
              </view>
            </view>
          </view>
        </view>
        <u-empty
          v-else
          color="rgb(204, 210, 218)"
          icon-color="rgb(204, 210, 218)"
          src=""
          text="暂无数据"
        />
      </view>
    </view>
    <!-- end vid_z2zwbzlow4 自定义模板_923j1t5i2v -->
  </view>
</template>
<script setup>

  import {
    ref,reactive,toRaw,markRaw,
    watch,computed,
    onBeforeMount,onMounted,onBeforeUnmount,onUnmounted,onActivated,onDeactivated,getCurrentInstance
  } from "vue";
  import { useRoute } from 'vue-router';
  const route = useRoute();
  import { get, post, put, del, request, requestWithHeaders } from '@/utils/http/Axios';
  import { cloneDeep, localGet, traversalTreeStructure, set, checkCaseCondition, throttle, merge, debounce, getGridStyle, getCellRenderAble, formulaStrategy } from '@/utils/index';
  import { isEqual, isNullOrEmpty, isEmptyArr, isArray, isEmpty, isNullOrUnDef, isContained } from '@/utils/is';
  import { CovertOptions, getChartsDataSourceConvert } from '@/utils/chart';
  import { propertyFormatByNumber, propertyFormatByPercentage, propertyFormatByDate } from '@/utils/format';
  import { FormFormat } from '@/utils/formFormat'
  import { customAddWaterMarkFunc, generateWaterMarkText } from '@/utils/addWaterMark';
  import dayjs from 'dayjs';
  import { handleRedirect } from '@/utils/common';
  import { onPullDownRefresh, onLoad, onReady, onShow, onHide, onPageScroll, onUnload } from '@dcloudio/uni-app';
  import hashSum from 'hash-sum';
  /*** UNI_APP_EXEGESIS ***
  import { handleRedirect, permission, parseJson } from '@/utils/common';
  import { onPullDownRefresh, onLoad, onReady, onShow, onHide, onPageScroll, onUnload } from '@dcloudio/uni-app';
  import { BroadcastMessage } from '@/utils/BroadcastMessage';
  import { sendToken } from "@/hooks/useIframeToken";
  *** UNI_APP_EXEGESIS ***/


  // ---------------------------- 属性定义 ----------------------------
  const sourceId = "page3000000251"

    // 是否显示菜单按钮
    const isMenuIconShow = false;
    // NAVIGATION_MENU
    const handleShowNavigation = ()=>{};

    let isProcessState = ref(false);


  const setTimeOutList = [];


      const vid_z2zwbzlow4_props = reactive({
        code: "<view class=\"container\">\n      <u-row class=\"search-params\">\n        <u-col :span=\"6\">\n          <u-popup-box\n              componentName=\"u-cascader-asymmetric\"\n              mode=\"tree\"\n              v-model:modelValue=\"state.searchParams.projectId\"\n              placeholder=\"项目名称\"\n              :border=\"false\"\n              :options=\"state.projectList\"\n              :fieldNames=\"state.fieldNames\"\n          >\n          </u-popup-box>\n        </u-col>\n        <u-col :span=\"3\">\n          <u-input :modelValue=\"state.taskStatusName\" type=\"select\" @click=\"state.statusVisible = true\" />\n          <u-select\n            v-model:modelValue=\"state.statusVisible\"\n            @confirm=\"handleConfirm\"\n            :pickValue=\"[state.searchParams.taskStatus]\"\n            mode=\"single-column\"\n            :list=\"state.taskStatusList\"\n            :clearable=\"false\"\n          ></u-select>\n        </u-col>\n        <u-col :span=\"3\">\n          <u-popup-box v-model:modelValue=\"state.searchParams.endTime\" :params=\"{ year: true, month: true, day: true }\" :border=\"false\" mode=\"time\" componentName=\"u-picker\"> </u-popup-box>\n        </u-col>\n      </u-row>\n\n      <view class=\"content\">\n        <view v-if=\"state.taskList.length\" v-for=\"item in state.taskList\" :key=\"item.taskId\" class=\"item\" @click=\"handleJumpDetail(item.taskId)\">\n          <view class=\"inner\">\n            <view class=\"title\">\n              <!-- <span v-if=\"item.mark\" class=\"mark\">{{ item.mark }}</span> -->\n              {{ item.taskName }}\n            </view>\n            <view class=\"article\">\n              <view class=\"class1\">\n<view style=\"display: flex;\">\n                  <view class=\"class2 mr10\">{{ item.taskStatus }}</view>\n                  <view class=\"first mr10\" v-if=\"item.mark==='初验' \">初验</view>\n                  <view class=\"lcb mr10\" v-if=\"item.mark==='里程碑' \">里程碑</view>\n                  <view class=\"finally mr10\"  v-if=\"item.mark==='终验' \">终验</view>\n                  <view class=\"gjlj mr10\" v-if=\"item.critialPath==='关键路径' \">关键路径</view>\n                  <view class=\"class2\" v-if=\"item.instanceId\" style=\"color: #FEA631;\">审批中</view>\n                </view>\n                <view class=\"class3\">\n                  <svg width=\"14px\" height=\"14px\" viewBox=\"0 0 14 14\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n                    <title></title>\n                    <g id=\"任务列表\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n                      <g id=\"任务详情-可编辑备份-6\" transform=\"translate(-296, -146)\" fill-rule=\"nonzero\">\n                        <g id=\"编组-14备份-2\" transform=\"translate(31, 143)\">\n                          <g id=\"编组-13\" transform=\"translate(258, 0)\">\n                            <g id=\"编组-9备份-5\" transform=\"translate(7, 1)\">\n                              <g id=\"编组-6\" transform=\"translate(0, 2)\">\n                                <rect id=\"矩形\" fill=\"#000000\" opacity=\"0\" x=\"0\" y=\"0\" width=\"14\" height=\"14\"></rect>\n                                <path\n                                  d=\"M9.40794574,10.9544574 L10.0862403,10.9544574 L10.0862403,10.2083333 L9.47577519,9.59786822 L7.91569767,9.59786822 L8.72965116,8.24127906 L10.0184109,8.24127906 L11.375,9.59786822 L11.375,12.3110465 L7.98352714,12.3110465 L9.40794574,10.9544574 L9.40794574,10.9544574 Z M4.65988372,10.9544574 L6.01647286,12.3110465 L2.625,12.3110465 L2.625,9.59786822 L2.69282946,9.59786822 L4.0494186,8.24127906 L5.3381783,8.24127906 L6.15213179,9.59786822 L4.59205426,9.59786822 L3.98158914,10.2083333 L3.98158914,10.9544574 L4.65988372,10.9544574 L4.65988372,10.9544574 Z M10.0862403,4.51065892 C10.0862403,6.20639536 8.72965116,7.5629845 7.03391472,7.5629845 C5.33817828,7.5629845 3.98158914,6.20639534 3.98158914,4.51065892 C3.98158914,2.8149225 5.3381783,1.45833334 7.03391472,1.45833334 C8.72965115,1.45833334 10.0862403,2.81492248 10.0862403,4.51065892 L10.0862403,4.51065892 Z M8.72965116,4.51065892 C8.72965116,3.56104651 7.98352714,2.81492248 7.03391472,2.81492248 C6.08430231,2.81492248 5.3381783,3.56104651 5.3381783,4.51065892 C5.3381783,5.46027133 6.08430233,6.20639534 7.03391472,6.20639534 C7.98352712,6.20639534 8.72965116,5.46027132 8.72965116,4.51065892 L8.72965116,4.51065892 Z M6.01647286,8.24127906 L8.05135658,8.24127906 L7.37306202,9.59786822 L8.05135658,11.6327519 L7.03391472,12.6501938 L6.01647286,11.6327519 L6.69476744,9.59786822 L6.01647286,8.24127906 L6.01647286,8.24127906 Z\"\n                                  id=\"形状\"\n                                  fill=\"#8C8C8C\"\n                                ></path>\n                              </g>\n                            </g>\n                          </g>\n                        </g>\n                      </g>\n                    </g>\n                  </svg>\n                  {{ item.taskOwner }}\n                </view>\n              </view>\n              <u-row class=\"row\">\n                <u-col :span=\"3\" class=\"title1\">项目名称:</u-col>\n                <u-col :span=\"9\" class=\"value1\" style=\"margin-left: -32rpx;\">{{ item.projectName }}</u-col>\n              </u-row>\n              <u-row class=\"row\">\n                <u-col :span=\"3\" class=\"title1\">项目阶段:</u-col>\n                <u-col :span=\"9\" class=\"value1\" style=\"margin-left: -32rpx;\">{{ item.milepostName }}</u-col>\n              </u-row>\n              <u-row class=\"row no-padding\">\n                <u-col :span=\"6\">\n                  <u-row class=\"no-padding\">\n                    <u-col :span=\"5\" class=\"title1\">计划开始:</u-col>\n                    <u-col :span=\"7\" style=\"padding: 0;\" class=\"value1\">{{ item.startTime }}</u-col>\n                  </u-row>\n                </u-col>\n                <u-col :span=\"6\">\n                  <u-row class=\"no-padding\">\n                    <u-col :span=\"5\" class=\"title1\">实际开始:</u-col>\n                    <u-col :span=\"7\" style=\"padding: 0;\" class=\"value1\">{{ item.actualStartTime }}</u-col>\n                  </u-row>\n                </u-col>\n              </u-row>\n              <u-row class=\"row no-padding\">\n                <u-col :span=\"6\">\n                  <u-row>\n                    <u-col :span=\"5\" class=\"title1\">计划完成:</u-col>\n                    <u-col :span=\"7\" style=\"padding: 0;\" class=\"value1\">{{ item.endTime }}</u-col>\n                  </u-row>\n                </u-col>\n                <u-col :span=\"6\">\n                  <u-row>\n                    <u-col :span=\"5\" class=\"title1\">实际完成:</u-col>\n                    <u-col :span=\"7\" style=\"padding: 0;\" class=\"value1\">{{ item.taskFinishTime }}</u-col>\n                  </u-row>\n                </u-col>\n              </u-row>\n              <view class=\"label-wrapper\">\n                <template v-for=\"(label, index) in item.labelList\" :key=\"index\">\n                  <view class=\"label\" v-if=\"hasTime(label)\" :class=\"activeClass(label)\">\n                    {{ label }}\n                  </view>\n                </template>\n              </view>\n            </view>\n          </view>\n        </view>\n        <u-empty\n          v-else\n          color=\"rgb(204, 210, 218)\"\n          icon-color=\"rgb(204, 210, 218)\"\n          src=\"\"\n          text=\"暂无数据\"\n        />\n      </view>\n    </view>",
    });



  // ============================ 属性定义 ============================

  // ---------------------------- 元素数据引用 ----------------------------
  // 组件 自定义模板_923j1t5i2v ref 的引用
  const vid_z2zwbzlow4_ref = ref(null);
  // 动态key的map
  const fieldTypeMap = {};
  // 动态key的map
  const refMap = {vid_z2zwbzlow4_ref};

  const showState = reactive({
      vid_z2zwbzlow4_visible: true,
  })
  // ============================ 元素数据引用 ============================

  // ---------------------------- 数据 ----------------------------


  // ============================ 数据 ============================

  // ---------------------------- 方法 ----------------------------
  // ---------------------------- 页面数据 ----------------------------


  // ============================ 页面数据 ============================

  // ---------------------------- 响应 ----------------------------

  // ============================ 响应 ============================

  // ---------------------------- 函数 ----------------------------

  // 自定义函数 返回上一页
  const customFunction_goBack_ksoncqsz03 =  (...params) => {
    uni.navigateBack()
  }

  // ============================ 函数 ============================

  // ---------------------------- 页面参数 ----------------------------

  const pageParameter_state = reactive({
      'processInstanceId': undefined,
  })

  // ============================ 页面参数 ============================

  // ---------------------------- 组件事件处理方法 ----------------------------


  // ============================ 组件事件处理方法 ============================

  // ============================ 方法 ============================

  // ---------------------------- 生命周期 ----------------------------
  /*** UNI_APP_EXEGESIS ***
      // 获取上一层传递的数据
      const workflowChannel = new BroadcastMessage('WORKFLOW');
      workflowChannel.publish({ status: 'Ready' });
      workflowChannel.subscribe((data) => {
        if (data) {
          isProcessState.value = (window.self !== window.parent && data.type === 'hideHeader');
        }
      });
      *** UNI_APP_EXEGESIS ***/


  const pageScrollTop = ref(0)

  // *** PREVIEW_EXEGESIS ***
  onMounted(() => {
    setPageParams(route.query)
    // 设置表单的rule
    try{

    }catch{
        // do nothing
    }
  });
  // *** PREVIEW_EXEGESIS *** //

  /*** UNI_APP_EXEGESIS ***
  const routeOption = ref({})
  onLoad((option) => {
    routeOption.value = option;
  });
  onReady(() => {
    setPageParams(routeOption.value)
    // 设置表单的rule
    try{

    }catch{
        // do nothing
    }
  });
  // 图表刷新标记
  const uChartsReshowFlag = ref(false);
  onHide(() => { // 页面隐藏后标记置为false(如果不置为false无法触发图表更新)
      uChartsReshowFlag.value = false
  })
  onShow(() => {
      uChartsReshowFlag.value = true; // 页面激活后,标记置为true

      setPageParams(routeOption.value)
  })
  onPageScroll(e => {
      pageScrollTop.value = e.scrollTop
  });
  *** UNI_APP_EXEGESIS ***/

  const setPageParams = (routerParam)=>{
    const pageParams = [{"dataType":"STRING","dependencies":[],"name":"processInstanceId"}];
    const strategyMap = {
      STRING: (param, paramValue) => {
        pageParameter_state[param.name] = paramValue;
      },
      BOOLEAN: (param, paramValue) => {
        if('true' === (paramValue || '').toLowerCase()) {
          pageParameter_state[param.name] = true
        } else if('false' === (paramValue || '').toLowerCase()) {
          pageParameter_state[param.name] = false
        } else {
          // TODO: 是否要支持toast
          console.error('参数传入错误！类型不匹配！');
        }
      },
      NUMBER: (param, paramValue) => {
        if (!isNaN(paramValue)) {
          pageParameter_state[param.name] = Number(paramValue);
        } else {
          // TODO: 是否要支持toast
          console.error('参数传入错误！类型不匹配！');
        }
      },
      ARRAY: (param, paramValue) => {
        if (isNullOrUnDef(paramValue) || !paramValue || paramValue=== 'undefined') { // default value
          pageParameter_state[param.name] = [];
        } else if(paramValue.trim().startsWith('[') && paramValue.trim().endsWith(']')) {
          try {
            pageParameter_state[param.name] = JSON.parse(decodeURI(paramValue));
          } catch (error) {
            console.error('参数解析失败 ',error);
          }
        } else {
          console.error('参数传入错误！类型不匹配！');
        }
      },
    };
    pageParams.forEach((param) => {
      strategyMap[param.dataType](param, routerParam[param.name])
    });


  }

  onUnmounted(() => {
    // 销毁定时器
    setTimeOutList.forEach(({ repeat, timer }) => {
      repeat ?  clearInterval(timer): clearTimeout(timer);
    });
  });


  /*** UNI_APP_EXEGESIS ***
  onPullDownRefresh(() => {
    // 下拉刷新
    setTimeout(() => {
        uni.stopPullDownRefresh()
    }, 1000)
  })
  *** UNI_APP_EXEGESIS ***/

  // ============================ 生命周期 ============================

  // ---------------------------- 数据关联处理 ----------------------------
  // ---------------------------- 组件数据同步 ----------------------------

  // ============================ 组件数据同步 ============================
  //
  // ============================ 数据关联处理 ============================

  // ---------------------- 不同组件自定义的处理逻辑 ---------------------

  // ====================== 不同组件自定义的处理逻辑 ======================


  // ================================定制化逻辑========================================
  const state = reactive({
            statusVisible: false,
            projectName: '项目菜单',
            taskStatusName: '进行中',
            projectList: [],
            searchParams: {
              projectId: null,
              taskStatus:  '进行中',
              endTime: dayjs().add(6, 'month').format('YYYY-MM-DD'),
              pageSize: 10000,
              pageNo: 1
            },
            fieldNames: {
              label: 'name',
              value: 'id',
              children: 'children'
            },
            taskStatusList: [{
              "value": null,
              "label": "全部任务状态"
            },{
              "value": "未启动",
              "label": "未启动"
            },
              {
                "value": "进行中",
                "label": "进行中"
              },
              {
                "value": "延期",
                "label": "延期"
              },
              {
                "value": "延期完成",
                "label": "延期完成"
              },
               {
                 "value": "审批中",
                 "label": "审批中"
               },
              {
                "value": "已完成",
                "label": "已完成"
              }
            ],
            taskList: [],
            endTimeVisible: false,
          })
          onMounted(() => {

            let appDiv = document.querySelector('#app')
            if (appDiv) {
              appDiv.style.background='linear-gradient(rgb(225, 239, 253) 100%, rgb(255, 255, 255) 0%)';
            }
            let topHeader = document.querySelector('.uni-page-head');
            if (topHeader) topHeader.remove()
            let warpper = document.querySelector('uni-page-wrapper')
            if(warpper) warpper.style.height= '100%';
              // 请求项目列表
              getProjectList()
          })

           onShow(() => {
             getTaskList(state.searchParams);
           })

          watch(() => state.searchParams, (val) => {
            getTaskList(state.searchParams)
          }, {
            deep: true
          })

          function getProjectList() {
            get('/solution-ppm/api/v2/built-in-system-ppm/dashboard/project/tree').then(({ data }) => {
              // traversalTreeStructure1(data);
              state.projectList = data;
            })
          }
          // 递归遍历树结构 属性children为null则删除
          function traversalTreeStructure1(tree) {
            tree.forEach(item => {
              if (item.children) {
                traversalTreeStructure1(item.children);
              } else {
                delete item.children;
              }
            })

          }
          function getTaskList(params) {
            post('/solution-ppm/api/v2/built-in-system-ppm/dashboard/task/list', params).then(({ data }) => {
              state.taskList = data.dataList
            }).catch(() => {
              state.taskList = []
            })
          }
          function handleJumpDetail(id,item) {
            if(item.actionTaskId!==null){
              handleRedirect(`/pages/Page3000000252/Page3000000252?id=${id}&actionTaskId=${item.actionTaskId}&type=行动项任务`)
            }else{
              handleRedirect(`/pages/Page3000000252/Page3000000252?id=${id}&actionTaskId=${item.actionTaskId}&type=普通任务`)
            }
            
          }

          function handleConfirm(val) {
            state.taskStatusName = val[0].label;
            state.searchParams.taskStatus = val[0].value;
          }


          const activeClass = (text) => {
            return {
              time: text.startsWith('倒计时'),
              delay: text.startsWith('延期'),
              add: !text.startsWith('倒计时') && text.indexOf('+') !== -1,
              minus: !text.startsWith('倒计时') && text.indexOf('-') !== -1,
            }
          }
          const hasTime = computed((text) => {
            return (text) => {
              if (!text.startsWith('倒计时')) {
                return true;
              }
              return text.indexOf('-') === -1
            }
          })
          function handlerGetSpace1(data) {
  return data ? data.split(/[,，;；\n]/).map(item => item.trim()) : []
}
</script>
<style lang="less" scoped>
  .page_root {
      min-height: 100%;
      box-sizing: border-box;
  }


  .page_root {
          min-height: 100%;
          box-sizing: border-box;
          background: #E1EFFD;
        }
        .container .search-params * {
          text-align: center;
        }
        .container .search-params :deep(.input-placeholder) {
          color: #fff !important;
        }
        .container .search-params :deep(.uni-input-input), .container .search-params :deep(.uicon-arrow-down-fill) {
          color: #fff !important;
          font-size: 30rpx !important;
          overflow-x: auto !important;
          text-align: center!important;
        }
        .container .search-params :deep(.uicon-arrow-down-fill){
          font-size: 24rpx !important;
        }
        .container .search-params {
          background: #3575C7;
          height: 45px;
          padding: 0 15px;
        }
        .container .content .item .title {
          width: 100%;
          height: 32px;
          background-image: linear-gradient(90deg, #CDE8FD 0%, rgba(205,232,253,0.00) 100%);
          font-size: 16px;
          color: #262626;
          letter-spacing: 0;
          font-weight: 600;
          line-height: 32px;
          padding: 0 14px;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          word-break: keep-all;
        }

        .container .content .item .article .class1 {
          display: flex;
          justify-content: space-between;
          font-size: 24rpx;
          margin-bottom: 6px;
        }

        .container .content .item .article .class2.class4 {
          color: #CD19FF;
        }
        .container .content .item .article .class2.class3 {
          color: #16DC4F;
        }

        .container .content .item .article .class2 {
          background-image: linear-gradient(180deg, rgba(255,255,255,0.80) 0%, rgba(255,255,255,0.90) 50%, rgba(255,255,255,0.80) 100%);
          border: 1px solid #FFFFFF;
          box-shadow: 0 2px 10px 0 #CFE7FF;
          border-radius: 9px;
          font-weight: bold;
          text-align: center;
          color: #2CD8F9;
          padding: 0 16rpx;

        }
        .container .content .item .article .class3 {
          width: 140rpx;
          text-align: right;
          background-image: linear-gradient(270deg, rgba(205,232,253,0.00) 0%, #CDE8FD 100%);
          border-radius: 20rpx;
          color: #595959;
          display: flex;
          justify-content: center;
          align-items: center;
          padding: 0 16rpx;
        }
        .container .content .item .article .title1 {
          font-size: 28rpx;
          color: #595959;
          padding: 0;
        }
        .container .content .item .article  .value1 {
          font-size: 28rpx;
          color: #262626;
          font-weight: 600;
          white-space: nowrap;
          word-wrap: break-word;
          text-overflow: ellipsis;
          overflow: hidden;
        }
        .container .content .item .article .row {
          margin-bottom: 5px;

        }
        .container .content .item .article  .no-padding .title1 {
          padding: 0!important;
        }

        .container .content .item .article {
          background: #fff;
          padding: 16rpx 26rpx 16rpx;
          border-radius: 0 0 12rpx 12rpx;

        }
        .container .content .item {
          border-radius: 10rpx;
          margin-bottom: 30rpx;
          overflow: hidden;
        }
        .container .content .inner {
          border: 6rpx solid;
          border-image: linear-gradient(360deg, rgba(41,129,223, 0) 0%, rgba(41,129,223, 1) 100%) 3 3 3 3;
        }

        .container .content {
          position: relative;
          height: calc(100vh - 80rpx);
          background: linear-gradient(180deg, #E1EFFD 100%, #ffffff 0%);
          padding: 15px;
          overflow: auto;
          margin-top: 0px;
        }

      .container .content .item .article .mr10 {
          margin-right: 20rpx;
      }

      .container .content .inner .mark {
        font-size: 24rpx;
        color: #008bff;
        padding: 2rpx 8rpx;
        border: 2rpx solid #008bff;
        border-radius: 14rpx;
        position: relative;
        top: -1px;
    left: -4px;
      }

      .container .content .item .label-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
      }
      .container .content .item .label {
        font-size: 24rpx;
        padding: 0 8rpx;
        margin-right: 8rpx;
        border-radius: 2rpx;
      }
      .container .content .item .add {
        background: rgba(82,196,26,.1);
        color: rgba(82,196,26,1);
      }
     .container .content .item .minus, .container .content .item .delay {
        background: rgba(245,34,45, .1);
        color: rgba(245,34,45,1);
      }
      .container .content .item .time {
        background: rgba(255,123,0, .1);
        color: rgba(255,123,0,1);
      }


        /*
        标志
        */

        .first,.lcb,.finally,.gjlj{
          background-image: linear-gradient(180deg, rgba(255,255,255,0.80) 0%, rgba(255,255,255,0.90) 50%, rgba(255,255,255,0.80) 100%);
            border: 1px solid #FFFFFF;
            box-shadow: 0 2px 10px 0 #CFE7FF;
            border-radius: 9px;
            font-weight: bold;
            text-align: center;
            color: #2CD8F9;
            padding: 0 16rpx;
        }
        .first{
          color: #00B4EC;
        }
        .lcb{
          color:#3875FF;
        }
        .finally{
          color:#EA00FF;
        }
        .gjlj{
          color:#FF9846;
        }
   .container .content .item .minus[data-v-1fad1d5b], .container .content .item .delay{
          margin-bottom: 3px;
        }
        .container .content .item .add{
          margin-bottom:3px;
        }
        .new-text{
          font-size: 14px;
color: #262626;
letter-spacing: -0.2px;
text-align: justify;
font-weight: 600;
        }
        .new-title{
          font-size: 14px !important;
color: #595959;
letter-spacing: 0;
font-weight: 400;
        }
</style>
